@baseColor: #FAFAFA;

._home {
  background-color: @baseColor;
  width: 100%;
  text-align: center;

  ._content {
    width: 80%;
    margin: 0 auto;
    padding: 10px 0;

    .fs_pc_top_bar {
      height: 30px;
      background-color: rgb(255, 80, 0);
      display: inline-flex;
      width: 100%;
      color: #FFF;
      padding: 0.5em 0em;

      .fs_pc_theme_shop_title {
        width: 25%;
      }

      .fs_pc_activity_title {
        width: 55%;
        border-left: 3px dotted #FAFAFA;
        border-right: 3px dotted #FAFAFA;
      }

      .fs_pc_base_info_title {
        width: 20%;
      }
    }

    .fs_pc_content {
      width: 100%;
      display: inline-flex;
      padding: 5px 0px;

      .fs_pc_theme_shop {
        width: 25%;
        background-color: #FFF;
        padding-top: 6px;
        display: flex;
        flex-flow: column wrap;
        justify-content: space-between;

        .fs_pc_theme_shop_content {
          width: 100%;
          height: 32px;
          display: inline-flex;
          text-align: center;
          padding: 6px 0;

          .fs_pc_fir_kind {
            width: 25%;
            font-family: Droid Sans;
            font-size: 1.1em;
            border-right: 0.1px solid #000;
            display: inline-flex;
            padding: 0 5px;
            background-color: rgb(255, 244, 207, 0.4);

            div {
              margin: 0 2px 0;
              overflow: hidden;
              text-overflow: ellipsis;
              white-space: nowrap;
            }
          }

          .fs_pc_sec_kind {
            width: 75%;
          }
        }
      }

      .fs_pc_activity {
        width: 55%;
        padding: 0px 10px;
        margin: 0 auto;
      }

      .fs_pc_base_info {
        width: 20%;
        padding: 6px 10px;
        background-color: #FFF;
      }
    }

    .fs_pc_seckill {
      width: 100%;
      margin-top: 20px;
      display: inline-flex;
      justify-content: flex-start;
      overflow: hidden;
      max-height: 256px;

      .fs_pc_seckill_facade {
        width: 16%;
      }

      .fs_pc_seckill_product {
        width: 84%;
        display: inline-flex;
        justify-content: flex-start;
        margin: 0px 5px;

        .fs_pc_seckill_product_card {
          width: 19%;
          margin: 0px 6px;
        }

      }

    }

    .fs_pc_product_module {
      width: 100%;
      margin: 10px 0;
    }


    .fs_pc_product_recommend_title {
      text-align: left;
    }

    .fs_pc_product_recommend {
      width: 100%;
      margin-top: 10px;
      display: inline-flex;
      flex-flow: row wrap;

      .fs_pc_product_recommend_item {
        width: 19%;
        margin: 0 0.4%;
        padding: 10px 0px;
      }
    }
  }
}


/* 移动端适配 */
@media screen and (max-width: 500px) {
  ._home {
    text-align: center;
    padding: 0.5em 1em;

    ._content {
      width: 100%;
      padding: 10px 0;

      .fs_mb {
        width: 100%;

        .fs_mb_activity {
          box-shadow: 0 3px 0 rgb(245, 246, 247);
          margin: 4px 5px;
        }

        .fs_mb_title {
          margin-top: 10px;
          margin-bottom: 0px;
          margin-left: 5px;
          margin-right: 5px;
          text-align: left;
        }

        .fs_mb_theme_shop {
          width: 100%;
          margin: 0px 5px;
          padding: 5px 10px;
          background-color: #FFF;
          box-shadow: 0.5px 0.5px 0.5px 0.5px rgba(0, 0, 0, 0.3);
          border-radius: 1px;
        }

        .fs_mb_seckill {
          width: 100%;
          text-align: center;
          display: inline-flex;
          flex-flow: row wrap;

          .fs_mbs_card {
            width: 48%;
            margin: 1% 1%;
          }
        }
      }
    }
  }
}

.ant-carousel .slick-slide {
  height: 180px;
  text-align: center;
  position: default;
  display: block;
}

.ant-carousel .slick-dots li button {
  background: rgb(255, 80, 0, 0.3);
}

.ant-carousel .slick-dots li.slick-active button {
  background: rgb(255, 80, 0, 0.1);
}

.ant-carousel .slick-dots-bottom {
  bottom: 0px;
}

.slick-dots .slick-dots-bottom {
  margin-top: 30px;
  display: block;
  position: default;
}
